<html>
	<head>
		<meta http-equiv="Content-type" content="text/html; charset=utf-8">
		<title>calendar_test</title>
		<link rel="stylesheet" href="http://www.philippdatz.de/calendar/assets/css/reset.css" type="text/css" media="screen">
		<link rel="stylesheet" href="http://www.philippdatz.de/calendar/assets/css/master.css" type="text/css" media="screen">
		
		<script src="<?php echo BASE_URL(); ?>assets/js/mootools-release-1.11.js" type="text/javascript" charset="utf-8"></script>

		<script type="text/javascript" charset="utf-8">
		
			
			var hourHeight = 25;
			var dayWidth = 400;
			
			
			window.addEvent('domready', function() {
			
				
				var container = $('day');
				var entries = $$('div.entry');
				
				
				entries.each( function(div) {
				
					new Drag.Move( div.id, {
										
						'container': $('day'),
						'grid' : hourHeight / 2,
						'droppables': entries,
						
						onStart: function() {
								
							oldEventStart = $(div.id).style.top;
							
						},
								
						onDrag: function() {
			
							updateEntryStart(div.id);
				
						},
								 
						onComplete: function() { 
						
							newEventStart = $(div.id).style.top;
								
							if ( oldEventStart !== newEventStart ) {
					
								editEntry( div.id );
								
							} 
							
							entryHitTest( $(div.id), $(div.id).style.top, $(div.id).style.height );
							
						}
								
					});
				
				});
				
			});
			
			function Numsort (a, b) {
				
				return a - b;
			
			}
			
			function entryHitTest( entry, start, duration ) {
			
				/* 	DIESE FUNKTION MACHT EIN NEUES MULTIDIMENSIONALES 
					ENTRY-ARRAY NACH DEM SCHEMA: 
					
					entries ( 
					
						entry1 (
						
							entry1.id,
							entry1.start,
							entry1.end
						
						)
						
						entry2 (
						
							.. usw
						)
						
					) 
					
				*/
				/*
				var entriesArray = new Array();
				entries = $$('div.entry');
				
				entries.each( function(e) {
				
					var top = parseFloat( e.style.top );
					var height = parseFloat( e.style.top ) + parseFloat( e.style.height );
				
					entriesArray.push( new Array( e.id, top, height ));
					
				
				});
				
				alert( entriesArray[0][0] );
				*/
				
				var entriesArray = new Array();
				entries = $$('div.entry');
				
				entries.each( function(e) {
				
					var top = parseFloat( e.style.top );
					entriesArray.push( new Array( top, e.id ) );
					
				});
				
				entriesArray.sort(Numsort);
				
				alert( entriesArray);
				
				entryStartpoints = new Array();
				
				/*
				start 	= parseFloat( start );
				end 	= start + parseFloat( duration );
				
				entries = $$('div.entry');
				
				entries.each( function(e) {
				
					var top = parseFloat( e.style.top );
					var height = parseFloat( e.style.top ) + parseFloat( e.style.height );
					
					if (  (( start > top ) && ( start < height ))  ||  (( end > top ) && ( end < height ))  ) {
						
						$(entry).setStyle('width', dayWidth / 2 + 'px');
						$(e).setStyle('width', dayWidth / 2 + 'px');
						
					}
					
					if (  (( end < top ) || ( start > height ))  &&  (( end < top ) || ( end > height ))  ) {
					
						$(entry).setStyle('width', dayWidth + 'px');
						$(e).setStyle('width', dayWidth + 'px');
					
					}
					
				});
				*/
				
			}
			
			function editEntry(id) {
				
				/* 
				
					ACHTUNG, ACHTUNG!!! Noch vom Layout abhaengig!
				
				*/
				
				if ( $(id).style.top == 0 ) {
					start = 1199142000;
				} else {
					start = 1199142000 + (( $(id).style.top.substr(0, $(id).style.top.length - 2) / hourHeight ) * 3600);
				}
				
				end = start + (( $(id).style.height.substr(0, $(id).style.height.length - 2) / hourHeight ) * 3600);
				
				var url = "<?=BASE_URL(); ?>index.php/application/editEntry";
				
				new Ajax ( url, {
					postBody: 'id=' + id + '&start=' + start + '&end=' + end 
					}
				).request();
				
			}
			
			function addEntry(event) {
			
				EventStart = ((event.client.y/(hourHeight/2)).round())*(hourHeight/2);
			
				var url = "<?=BASE_URL(); ?>index.php/application/addEntry";
				
				new Ajax(url, {
					postBody: 'start=' + EventStart,
					onComplete: function(request){ drawEntry(request) }
				}).request();
				
			}
			
			function drawEntry(request, Eventstart) {
			
				var requestdata = request.split(',');
				
				var requestID = requestdata[0];
				
				var requestStart = requestdata[1];
				
				var requestEnd = requestdata[2] - requestdata[1];
				
				var element = new Element('div', {
					'styles': {
						'left': 	0,
						'width': 	dayWidth,
						'height': 	requestEnd,
						'top': 		requestStart
					},
					'id': 			requestID,
					'class': 		'entry'
				});
				
				var handler = new Element('div', {
					'id': 		'handler' + ($$('div.entry').length + 1),
					'class': 	'handler'   
				});
				
				var deleter = new Element('div', {
					'onclick': 	'deleteEntry($(this.parentNode).id)',
					'class': 	'delete'   
				});
				
				$(element).setHTML('Neues Ereignis'); 
				
				$(element).injectInside('day');
				$(handler).injectInside(element);
				$(deleter).injectInside(element);
				
				$(element).makeResizable({
						
					onStart: function() {
						oldEventStart = $(element).style.top;
					},
					
					onComplete: function() { 
						newEventStart = $(element).style.top;
							
						if ( oldEventStart !== newEventStart ) {
							editEntry(element);
						} 
					}, 
					
					grid: hourHeight / 2, 
					modifiers: {x: false, y: 'top'}, 
					limit: {y: [0, 24 * hourHeight]} 
							
					});
						
				$(element).makeResizable({ 
						
					onComplete: function() { 
						editEntry(element);
					}, 
					
					handle: 'handler' + requestID, 
					grid: hourHeight / 2, 
					modifiers: {x: false, y: 'bottom'}, 
					limit: {y: [hourHeight, 24 * hourHeight - requestStart]} 
							
					});
				
			}
			
			function deleteEntry(id) {
			
				new Ajax('<?=BASE_URL(); ?>index.php/application/deleteEntry', {postBody: 'id=' + id}).request();
				
				$(id).effect('opacity', {duration: 100}).start(.8,0);
				
				$(id).remove();
			
			}
			
			function updateEntryStart(entry) {
			
				EntryStart = ((( parseFloat( $(entry).style.top ) * 4 )) / 100).toString().split('.');
				
				EntryStartHours = EntryStart[0];
				
				if ( !EntryStart[1] ) {
				
					EntryStartMins = '00';
				
				} else {
				
					EntryStartMins = 30;
				
				}
				
				$(entry).getElement('div[class=entryHeader]').innerHTML = EntryStartHours + ':' + EntryStartMins;
				
			}
			
			function mapEntries() {
			
				
				var entries = $$('div.entry');
				
				entries.addEvent('over', function(){
					this.setStyle('background-color', '#000');
				});
				
				
				/*
				var entryMap = $$('#day div.entry');
				
				for ( var i = 0; i < entryMap.length; ++i ) {
				
					entryMap[i] = new Array( entryMap[i].id, parseFloat( entryMap[i].style.top ), parseFloat( entryMap[i].style.top ) + parseFloat( entryMap[i].style.height ) );
					
					alert( entryMap[i] );
				
				}
				*/
				 
			
			}
			
		</script>

	</head>
	<body>
		<?php
			echo $content;
		?>
		<script type="text/javascript" charset="utf-8">

			$('day').addEvent('dblclick', addEntry.bindWithEvent('day'));

		</script>
	</body>
</html>